<template>
  <ele-page>
    <ele-card :body-style="{ paddingTop: '8px' }">
      <!-- 表格 -->
      <ele-pro-table
        ref="tableRef"
        :columns="columns"
        :datasource="datasource"
        :show-overflow-tooltip="true"
        highlight-current-row
        stripe
        border
      >
        <template #img="{ row }">
          <span
            v-if="row.refund_pdf !== ''"
            class="pointer blue"
            @click="openPdf(row.refund_pdf)"
            >查看</span
          >
          <span v-else>无</span>
        </template>
        <template #action="{ row }">
          <el-button type="success" size="small" @click="opewDone(row)">
            已退
          </el-button>
        </template>
      </ele-pro-table>
    </ele-card>
    <!-- 图片 -->
    <done v-model="showDone" :data="current" @done="reload" />
  </ele-page>
</template>

<script setup>
  import { ref, computed } from 'vue';
  import { pageRefundList } from '@/api/company';
  import Done from './components/done.vue';

  /** 表格实例 */
  const tableRef = ref(null);

  /** 表格列配置 */
  const columns = computed(() => {
    const cols = [];

    cols.push(
      {
        width: 70,
        prop: 'id',
        label: '编号'
      },
      {
        width: 120,
        prop: 'plate_number',
        label: '车牌'
      },
      {
        width: 180,
        prop: 'insurance',
        label: '保险公司'
      },
      {
        width: 180,
        prop: 'insurance_salesman',
        label: '业务员'
      },
      {
        width: 120,
        prop: 'refund_rebate',
        label: '要退的返点'
      },
      {
        width: 80,
        slot: 'img',
        label: '批单',
        align: 'center'
      },
      {
        slot: 'action',
        label: '操作'
      }
    );

    return cols;
  });

  /** 表格数据源 */
  const datasource = async ({ page, limit, where, orders }) => {
    const result = await pageRefundList({
      ...where,
      ...orders,
      page,
      limit,
      cate: 'rebate'
    });
    return result;
  };
  /** 搜索 */
  const reload = (where) => {
    tableRef.value?.reload?.({ page: 1, where });
  };

  const current = ref([]);

  const openPdf = (url) => {
    window.open(url);
  };

  /** 退回 */
  const showDone = ref(false);
  const opewDone = (row) => {
    current.value = row;
    showDone.value = true;
  };
</script>
